<template>
    <el-header class="headNav" height="42px">
      <el-dropdown>
        <el-badge  class="info" value="new" >
            <el-button class="infoBtm" icon="el-icon-message" type="primary"></el-button>
        </el-badge>
        <el-dropdown class="setting">
          <el-button type="primary" icon="el-icon-s-tools"><i></i></el-button>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item>登出</el-dropdown-item>
            <el-dropdown-item>修改</el-dropdown-item>
            <el-dropdown-item>退出</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>  
      </el-dropdown>
      <span>王小虎</span>
    </el-header>
</template>

<script>
export default {
  name: "myheader",
};
</script>

<style scoped>
  .info{
      margin-right:25px;
  }
  .setting{
      margin-right:20px;
      box-sizing: border-box;
  }
  .headNav{
    text-align: right; 
    font-size: 12px;
    background-color:#409EFF;
    position: relative;
    width: 100%;
  }
</style>